<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>新书</title>
    <link rel="stylesheet" href="css/style2.css">
    <link rel="stylesheet" href="css/style.css">
    <script src="js/jquery-1.10.2.min.js"></script>
    <script src="js/amazeui.min.js"></script>
    <link rel="stylesheet" href="css/amazeui.min.css">
    <script>
        var iScale = 1;
        iScale = iScale / window.devicePixelRatio;
        document.write('<meta name="viewport" content="width=device-width,user-scalable=no,' +
                'initial-scale=' + iScale + ',minimum-scale=' + iScale + ',maximum-scale=' + iScale + '">');
    </script>
</head>
<body>
<div class="am-slider am-slider-default" data-am-flexslider id="demo-slider-0" style="position: relative;">
    <ul class="am-slides">
        <li ><img src="img/1111.png" alt=""></li>
        <li><img src="img/1111.png" alt=""></li>
        <li ><img src="img/1111.png" alt=""></li>
    </ul>
    <div class="cate-search">
        <input type="text" class="cate-input" placeholder="书名/作者/关键词" />
        <input type="button" class="cate-btn" />
    </div>
</div>
<!--头部结束-->
<div class="middle-one">
<div class="middle-one-top">
    <img src="img/xinshu.png" alt="">
</div>
  <ul class="ul-list-book">
      <li>
          <a href="详情.html">
          <img src="img/zhengce.png" alt="">
          </a>
          <p class="book-title">形式与政策</p>
          <p class="book-man">沈佳柯 著</p>
      </li>
      <li>
          <a href="详情.html">
          <img src="img/zhengce.png" alt="">
          </a>
          <p class="book-title">盖碗茶</p>
          <p class="book-man">单平 著</p>
      </li>
      <li>
          <a href="详情.html">
          <img src="img/zhengce.png" alt="">
          </a>
          <p class="book-title">这是我的人qweqw生，不是别人的</p>
          <p class="book-man">沈佳柯 著</p>
      </li>
      <li>
          <a href="详情.html">
          <img src="img/zhengce.png" alt="">
          </a>
          <p class="book-title">少有人走的路</p>
          <p class="book-man">张文智 著</p>
      </li>
      <li>
          <a href="详情.html">
          <img src="img/zhengce.png" alt="">
          </a>
          <p class="book-title">中华古韵</p>
          <p class="book-man">安国 译</p>
      </li>
      <li>
          <a href="详情.html">
          <img src="img/zhengce.png" alt="">
          </a>
          <p class="book-title">食草家族</p>
          <p class="book-man">莫言 著</p>
      </li>


  </ul>
</div>
<div data-am-widget="navbar" class="am-navbar am-cf am-navbar-default sq-foot am-no-layout" id="">
<ul class="am-navbar-nav am-cf am-avg-sm-4">
    <li>
        <a href="#" class="curr">
            <span><img src="img/q2.png"/></span>


        </a>
    </li>
    <li>
        <a href="阅读足迹.html" class="">
            <span><img src="img/w1.png"/></span>
        </a>
    </li>

    <li>
        <a href="书库.html" class="">
            <span><img src="img/e1.png"/></span>

        </a>
    </li>
</ul>
</div>

</body>
<script>
    $(function () {
        $(".book-man").each(function () {
            var maxwidth = 10;
            if ($(this).text().length = maxwidth) {
                var b = $(this).children().is("a");
                if (b) {
                    $(this).children().text($(this).children().text().substring(0, maxwidth) + "...");
                } else {
                    $(this).text($(this).text().substring(0, maxwidth));
                    $(this).text($(this).text() + "...");
                }

            }
        });

    });
</script>
<script>
    $(function(){
        //动态更新fontsize
        var width = $(document).width();
        var size = width/16;
        console.log(size);
        $('html').css('fontSize',size+'px');

    })
</script>
</html>